﻿@model SpaceNeedle.City6473.WebSite.Models.RequestsModel
@using SpaceNeedle.City6473.Web.Data.Models

@{
    Layout = "~/Views/Shared/_Layout.cshtml";
    ViewBag.Title = "Requests";

    var staticContent = ViewBag.StaticContent as WebSiteContent;
    ViewBag.Title = staticContent.Requests.PageTitle;

    //ViewContext.FormContext = new FormContext();
}

<style>
    #icons {
        margin-top: 10px;
        width: 250px;
        background-color: beige;
    }

        #icons ul {
            margin: 0;
            padding: 0;
            list-style-type: none;
            border-top: 1px solid #efefef;
            border-left: 1px solid #efefef;
        }

    .icon {
        line-height: 64px;
        text-align: center;
        margin: 0;
        padding: 0;
        width: 64px;
        height: 64px;
        float: left;
        border-bottom: 1px solid #efefef;
        border-right: 1px solid #efefef;
        background-color: #000000;
    }

    .selected-icon {
        line-height: 64px;
        text-align: center;
        margin: 0;
        padding: 0;
        width: 64px;
        height: 64px;
        float: left;
        border-bottom: 1px solid #efefef;
        border-right: 1px solid #efefef;
        background-color: blue;
    }

    #icons img {
        vertical-align: middle;
        width: 48px;
        /*display:block;*/
    }
</style>
<script>
    var selectedElement = null;

    function Select(element)
    {
        if (selectedElement != null)
        {
            selectedElement.className = "icon";
        }

        element.className = "selected-icon";

        selectedElement = element;

        $("#Icon").val(selectedElement.dataset.icon);
    }
</script>


<table style="width:800px;">
    <tr>
        <th>

        </th>
        <th style="text-align:center">
            @staticContent.Requests.Order
        </th>
        <th style="text-align:center;">
            @staticContent.Requests.Icon
        </th>
        <th style="text-align:left">
            @staticContent.Requests.Title
        </th>
        <th style="text-align:left">
            @staticContent.Requests.Description
        </th>
        <th style="text-align:center">
            @staticContent.Requests.IsEnabled
        </th>
        
        <th style="text-align:left">
 
        </th>
        <th>

        </th>
    </tr>

    <script>
        function MoveRequestUp(id)
        {
            ShowLoading();

            $.getJSON("/Admin/MoveRequestUp?id=" + id,
            function (data)
            {
                if (data == true)
                {
                    location.reload();
                }

                HideLoading();
            },
            function ()
            {
                HideLoading();
                alert('@staticContent.RequestItems.SaveStatusErrorMessage');
            });
        }

        function MoveRequestDown(id)
        {
            ShowLoading();

            $.getJSON("/Admin/MoveRequestDown?id=" + id,
            function (data)
            {
                if (data == true)
                {
                    location.reload();
                }

                HideLoading();
            },
            function ()
            {
                HideLoading();

                alert('@staticContent.RequestItems.SaveStatusErrorMessage');
            });
        }
    </script>
    @foreach (var item in Model.Requests)
    {
        <tr>
            <td style="text-align:center">
                <a style="font-family:'Segoe UI Symbol'" href="javascript:MoveRequestUp('@item.Id');">@Html.Raw(staticContent.Operations.UpSymbol)</a>
                <br />
                <a style="font-family:'Segoe UI Symbol'" href="javascript:MoveRequestDown('@item.Id');">@Html.Raw(staticContent.Operations.DownSymbol)</a>
            </td>
            <td style="text-align:center;">
                @item.Order
            </td>
            <td>
                <div class="icon" data-icon="@item.Icon"><img src="@item.Icon" /></div>
            </td>
            <td>
                @item.Title
            </td>
            <td>
                @item.Description
            </td>
            
            <td style="text-align:center;">
                @(item.IsEnabled?"Sim":"Não")
            </td>
            <td>
                <a href="/admin/deleterequest/@item.Id" onclick="return confirm('@string.Format(staticContent.Operations.DeleteMessage, item.Title)?')" title="@staticContent.Operations.Delete" style="font-family:'Segoe UI Symbol';font-size:18px;">@Html.Raw(staticContent.Operations.DeleteSymbol)</a>
            </td>
            <td>
                <a href="/Admin/EditRequest/@item.Id" title="@staticContent.Operations.Edit" style="font-family:'Segoe UI Symbol';font-size:18px;">@Html.Raw(staticContent.Operations.EditSymbol)</a>
            </td>
        </tr>
    }

</table>

<br /><br />
<h3>@staticContent.Requests.New</h3>
@using (Html.BeginForm())
{
    //var newModel = new Request();
    @*@Html.Hidden("Id", NewPhone.Id)*@
    
   @Html.ValidationSummary(true)

                <div class="editor-label">
                    @staticContent.Requests.Title
                </div>
                <div class="editor-field">
                    @Html.TextBoxFor(model => model.Title, new { @class = "form-control" })
                    @Html.ValidationMessageFor(model => model.Title)
                </div>
                <br />

                <div class="editor-label">
                    @staticContent.Requests.Description
                </div>
                <div class="editor-field">
                    @Html.TextAreaFor(model => model.Description, new { @class = "form-control" })
                    @Html.ValidationMessageFor(model => model.Description)
                </div>
                <br />

                <div class="editor-label">
                    @staticContent.Requests.Icon
                </div>
                
                <div id="icons">
                    @foreach (var icon in Model.Icons)
                    {
                        <div onclick="Select(this);" class="icon" data-icon="@icon"><img src="@icon" /></div>
                    }
                </div>

                <div class="editor-field">
                    @Html.Hidden("Icon", "", new { @class = "form-control" })
                    @Html.ValidationMessageFor(model => model.Icon)
                </div>
                
                <div style="clear:both">
                    <br />

                    <br />
           
                    <button class="btn btn-default" type="submit" value="Create">
                        @staticContent.Operations.Add
                    </button>
                </div>
              

}


